<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../lib/vue.js"></script>
    <script src="../lib/vue-router.js"></script>
</head>
<body>
    <div id="app">
        <router-link to="/login">登录</router-link>
        <router-link to="/register">注册</router-link>
        <router-view></router-view>
    </div>
    <script>
        var login={
            template:'<h1>登录</h1>'
        };
        var register={
            template: '<h2>注册</h2>'
        };
        var router=new VueRouter({
            routes:[
                {path:'/login',component:login},
                {path:'/register',component: register}
            ]
        });
        var vm = new Vue({
            el:"#app",
            router:router,
            watch:{
                '$route.path':function (newValue) {
                    console.log(newValue);
                }
            }
        })
    </script>
</body>
</html>